<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>数据体</title>
</head>
<body>
	<table id="request_grid" class="easyui-datagrid" title="数据体" style="width:100%;height:auto"
			data-options="
				iconCls: 'icon-edit',
				singleSelect: true,
				toolbar: '#request_tb',
				onClickCell: req_onClickCell,
				onEndEdit: req_onEndEdit
			">
		   <thead>
			<tr>
				<th data-options="field:'itemid',width:80">序号</th>
				<th data-options="field:'data_type',width:100,
						formatter:function(value,row){
							return row.typeName;
						},
						editor:{
							type:'combobox',
							options:{
								valueField:'id',
								textField:'typeName',
								method:'get',
								url:'base/dataType',
								required:true
							}
						}">数据类型</th>
				<th data-options="field:'reqest_param_name',width:250,editor:'textbox'">字段名称</th>
				<th data-options="field:'reqest_param_remake',width:250,editor:'textbox'">备注</th>
				<th data-options="field:'reqest_status',width:60,align:'center',editor:{type:'checkbox',options:{on:'YES',off:'NO'}}">是否为空</th>
			</tr>
		</thead>
	</table>

	<div id="request_tb" style="height:auto">
		<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true" onclick="req_append()">增加字段</a>
		<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true" onclick="req_removeit()">删除字段</a>
	</div>
	
	<script type="text/javascript">
		var req_editIndex = undefined;
		function req_endEditing(){
			if (req_editIndex == undefined){return true}
			if ($('#request_grid').datagrid('validateRow', req_editIndex)){
				$('#request_grid').datagrid('endEdit', req_editIndex);
				req_editIndex = undefined;
				return true;
			} else {
				return false;
			}
		}
		function req_onClickCell(index, field){
			if (req_editIndex != index){
				if (req_endEditing()){
					$('#request_grid').datagrid('selectRow', index)
							.datagrid('beginEdit', index);
					var ed = $('#request_grid').datagrid('getEditor', {index:index,field:field});
					if (ed){
						($(ed.target).data('textbox') ? $(ed.target).textbox('textbox') : $(ed.target)).focus();
					}
					req_editIndex = index;
				} else {
					setTimeout(function(){
						$('#request_grid').datagrid('selectRow', req_editIndex);
					},0);
				}
			}
		}
		function req_onEndEdit(index, row){
			var ed = $(this).datagrid('getEditor', {
				index: index,
				field: 'productid'
			});
			row.productname = $(ed.target).combobox('getText');
		}
		function req_append(){
			if (req_endEditing()){
				$('#request_grid').datagrid('appendRow',{status:'YES'});
				req_editIndex = $('#request_grid').datagrid('getRows').length-1;
				$('#request_grid').datagrid('selectRow', req_editIndex)
						.datagrid('beginEdit', req_editIndex);
			}
		}
		function req_removeit(){
			if (req_editIndex == undefined){return}
			$('#request_grid').datagrid('cancelEdit', req_editIndex)
					.datagrid('deleteRow', req_editIndex);
			req_editIndex = undefined;
		}
	</script>
</body>
</html>